html,body{
    height: 100%;
    width: 100%;
    margin: 0;
}
.mc-root{
    height: 90%;
    overflow: auto;
}
/*.magical-coder-tmp{
    display: inline-block;
}*/

.magical-coder-tmp >*{
    width:100%;
}
.magical-coder-tmp >.layui-form-switch{
    padding: 0;
    width:95%;
}
/*内部孩子间距*/
.mc-ui-between-space1{margin:-.5px}
.mc-ui-between-space1>*{padding:.5px}
.mc-ui-between-space2{margin:-1.5px}
.mc-ui-between-space2>*{padding:1.5px}
.mc-ui-between-space3{margin:-2.5px}
.mc-ui-between-space3>*{padding:2.5px}
.mc-ui-between-space4{margin:-3.5px}
.mc-ui-between-space4>*{padding:3.5px}
.mc-ui-between-space5{margin:-5px}
.mc-ui-between-space5>*{padding:5px}
.mc-ui-between-space6{margin:-6px}
.mc-ui-between-space6>*{padding:6px}
.mc-ui-between-space7{margin:-7.5px}
.mc-ui-between-space7>*{padding:7.5px}
.mc-ui-between-space8{margin:-9px}
.mc-ui-between-space8>*{padding:9px}
.mc-ui-between-space9{margin:-10px}
.mc-ui-between-space9>*{padding:10px}
.mc-ui-between-space10{margin:-11px}
.mc-ui-between-space10>*{padding:11px}
.mc-ui-between-space11{margin:-12.5px}
.mc-ui-between-space11>*{padding:12.5px}
.mc-ui-between-space12{margin:-15px}
.mc-ui-between-space12>*{padding:15px}
/*内部孩子居中*/
.mc-ui-flex-box{

}
/*水平垂直居中*/
.mc-ui-flex-start{
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    text-align: left !important;
    -webkit-box-pack: start !important;
    -ms-flex-pack: start !important;
    justify-content: flex-start !important;


    -webkit-box-align: start !important;
    -ms-flex-align: start !important;
    align-items: flex-start !important;
}
/*水平垂直居中*/
.mc-ui-flex-center{
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    text-align: center !important;
    -webkit-box-pack: center !important;
    -ms-flex-pack: center !important;
    justify-content: center !important;


    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
}
/*水平垂直居中*/
.mc-ui-flex-end{
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    text-align: right !important;
    -webkit-box-pack: end !important;
    -ms-flex-pack: end !important;
    justify-content: flex-end !important;

    -webkit-box-align: end !important;
    -ms-flex-align: end !important;
    align-items: flex-end !important;
}


/*扩展的新容器面板*/
.mc-ui-absolute-pane{
    position: relative;
    /* min-width: 1%; */
}

/*不能出现带margin-left margin-top*/
.mc-ui-absolute-pane>.layui-btn{
    margin-left:0px;
}
/*.mc-ui-absolute-pane>*:not(.layui-unselect):not(.mc-shade):not(.mc-net-line):not(.ivu-switch):not(.mini-layout){
    width:10%;
}*/
/*大部分控件拖拽到这里会变得很奇怪 所以这里给最小值 记住给百分比 这样可以自适应*/
.mc-ui-absolute-pane>form,
.mc-ui-absolute-pane>table,
.mc-ui-absolute-pane>fieldset,
.mc-ui-absolute-pane>blockquote,
.mc-ui-absolute-pane>img,
.mc-ui-absolute-pane>input,
.mc-ui-absolute-pane>ul:not(.ant-rate),
.mc-ui-absolute-pane>ol,
.mc-ui-absolute-pane>hr,
.mc-ui-absolute-pane>video,
.mc-ui-absolute-pane>audio,
.mc-ui-absolute-pane>iframe,
.mc-ui-absolute-pane>.mc-ui-absolute-pane,
.mc-ui-absolute-pane>.mc-ui-grid-pane,
/*图表*/
.mc-ui-absolute-pane>[class*="mc-echarts-"],
.mc-ui-absolute-pane>[class*="-card"],
.mc-ui-absolute-pane>[class*="-slider"],
.mc-ui-absolute-pane>[class*="-progress"],
.mc-ui-absolute-pane>[class*="-carousel"],
.mc-ui-absolute-pane>[class*="-collapse"],
.mc-ui-absolute-pane>[class*="-tabs"],
.mc-ui-absolute-pane>[class*="-row"],
.mc-ui-absolute-pane>.mc-tmp-width,
/*element*/
.mc-ui-absolute-pane>.el-calendar,
.mc-ui-absolute-pane>.el-table,
.mc-ui-absolute-pane>.el-alert,
.mc-ui-absolute-pane>.el-input,
/*layui*/
.mc-ui-absolute-pane>.magicalcoder-code,
.mc-ui-absolute-pane>.mc-tmp-layui-table,
.mc-ui-absolute-pane>.layui-row,
/*ant-design*/
.mc-ui-absolute-pane>.ant-input-search,
.mc-ui-absolute-pane>.ant-steps,
.mc-ui-absolute-pane>.ant-mentions,
/*miniui*/
.mc-ui-absolute-pane>.row,
.mc-ui-absolute-pane>.mini-listbox,
/*vant*/
.mc-ui-absolute-pane>.van-picker,
/*iview*/
.mc-ui-absolute-pane>.ivu-list,
.mc-ui-absolute-pane>.ivu-steps,
/*bootstrap*/
.mc-ui-absolute-pane>.card,
.mc-ui-absolute-pane>.progress,
.mc-ui-absolute-pane>.carousel,
.mc-ui-absolute-pane>.input-group,
.mc-ui-absolute-pane>textarea{
    width:45%;
}
.mc-ui-absolute-pane>*{
    min-width:1%;
}
.mc-ui-absolute-pane>.van-divider{
    width:100%;
}

/*.mc-ui-absolute-pane>span:not(.ivu-switch){
    width: 10%;
}*/
.mc-ui-absolute-pane .ivu-select-dropdown{
    width: unset;
}
 .mc-ui-absolute-pane>section,
 .mc-ui-absolute-pane>aside
 {
    width: 45% !important;
}

.mc-ui-absolute-pane>.layui-form-mid{
    width: 4px;
}
.mc-ui-absolute-pane>.layui-badge-dot{
    width: 8px;
}
.mc-ui-absolute-pane>.mini-layout{
    width: 80%;
}

.mc-table{
    width: 100%;
    background-color:#fff;
    color:#666;
}
audio{
    min-width: 300px;
}

/*点线面等几何图片的组件*/
/*矩形*/
.mc-ui-geometry-rectangle{
    border: 1px solid black;
}
/*横行*/
.mc-ui-geometry-x-line{
    height: 0px !important;
    border-top:1px solid black;
    border-left:1px solid black;
    border-right:1px solid black;
    z-index: 1;
}
/*竖线*/
.mc-ui-geometry-y-line{
    width: 0px !important;
    border-top:1px solid black;
    border-left:1px solid black;
    border-bottom:1px solid black;
    z-index: 1;
}
/*圆形*/
.mc-ui-geometry-round{
    border:1px solid black;
    border-radius:50%;
}

/*居中 自动根据屏幕的大小居中 如果像pad之类的小屏幕则不让居中生效*/
@media (min-width: 1200px) {
    .mc-margin-center-10{
        margin-left:10%;
        margin-right: 10%;
    }
    .mc-margin-center-20{
        margin-left:20%;
        margin-right: 20%;
    }
    .mc-margin-center-30{
        margin-left:30%;
        margin-right: 30%;
    }
}
 @media (min-width: 980px){
    .mc-margin-center-10{
        margin-left:10%;
        margin-right: 10%;
    }
    .mc-margin-center-20{
        margin-left:20%;
        margin-right: 20%;
    }
    .mc-margin-center-30{
        margin-left:30%;
        margin-right: 30%;
    }
 }
/*四个角 尖尖的 */
.mc-quadrangle {
    border: 1px solid rgba(25,186,139,.17);
    background: linear-gradient(#00faff, #00faff) left top,
    linear-gradient(#00faff, #00faff) left top,
    linear-gradient(#00faff, #00faff) right top,
    linear-gradient(#00faff, #00faff) right top,
    linear-gradient(#00faff, #00faff) left bottom,
    linear-gradient(#00faff, #00faff) left bottom,
    linear-gradient(#00faff, #00faff) right bottom,
    linear-gradient(#00faff, #00faff) right bottom;
    background-size: 2px 10px, 10px 2px;
    background-repeat: no-repeat;
    margin: 0px 0px 15px;
    width: 100%;
    height: 100%;
    padding: 2px;
}
/*填空题 自动把输入框两边加括号*/
.mc-form-tk {
    display: inline-block;
}
.mc-form-tk:before {
    content: "(";
}
.mc-form-tk:after {
    content: ")";
}
.mc-form-tk>input {
    width: calc(100% - 30px);
    display: inline-block;
}
